import React,{Component} from 'react'
import ActivityEditDetail from 'components/activity-edit-detail'
import ActivityEditMessage from 'components/activity-edit-message'
import ActivityTag from 'components/activity-tag'
import {Button, Divider} from 'antd'
import './index.less'
import VerticalDivider from 'common/vertical-divider'
import {inject, observer} from 'mobx-react'
import { Link } from 'react-router-dom'
/**
 * 名称：创建活动
 * 描述：分为活动编辑详情，活动话术编辑，活动标签选择页面
 * 调用：活动中心
 * 输入： 
 * 时间：20220328
 */
 @inject('activityStore','tagStore')
 @observer
class CreatingActivity extends Component{
   
     
    
    componentDidMount(){
        if (this.props.match.params.key){
            const {activityStore,tagStore} = this.props
            const activityDetail = activityStore.activityAll.find(item=>item.key === this.props.match.params.key)
            activityStore.setActivityName(activityDetail.name)
            activityStore.setActivityDescription(activityDetail.description)
            activityStore.setActivityStartTime( activityDetail.startTime)
            activityStore.setActivityEndTime( activityDetail.endTime)
            activityStore.setActivityMessage (activityDetail.message)
            activityStore.setActivityKey(activityDetail.key)
            tagStore.setUsedTags( activityDetail.usedTags)
            tagStore.setRecommendTags( activityDetail.recommendTags)
        } else {
            const {activityStore,tagStore} = this.props
            activityStore.setActivityName("")
            activityStore.setActivityDescription("")
            activityStore.setActivityStartTime( "")
            activityStore.setActivityEndTime( "")
            activityStore.setActivityMessage ("")
            activityStore.setActivityKey("")
            tagStore.setUsedTags( [])
            tagStore.setRecommendTags([])
        }
    }
    
    render(){
        const {activityStore,tagStore} = this.props
        const {usedTags} = tagStore
        let isEdit = false
        if (this.props.match.params.key){
            isEdit = true
        }
        return (
            <div className ="creating-activity">
                <div className="activity-edit">
                    <div className="activity-edit-detail">
                        <ActivityEditDetail className="activity-edit-detail" isEdit={isEdit}/>
                        
                    </div>
                    <VerticalDivider/>
                    <div className="activity-edit-message">
                        <ActivityEditMessage/>
                    </div>
                </div>
                <Divider/>
                <div className="activity-tag">
                        <ActivityTag/>
                </div>
                <div className="button">
                    
                    <Button onClick={()=>{
                        if(isEdit){
                            activityStore.apiEditActivity(usedTags)
                        }else{
                            activityStore.apiCreateActivity(usedTags)
                        }
                        
                        
                        }}>提交</Button>
                </div>
             </div>
        )
    }

}
export default CreatingActivity